const path = require('path');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const TerserPlugin = require('terser-webpack-plugin')
const CssMinimizerPlugin = require('css-minimizer-webpack-plugin')
const PurgeCssPlugin = require('purgecss-webpack-plugin')
const CompressionPlugin = require('compression-webpack-plugin')
const glob = require('glob')

const resolveApp = require('./paths');
const webpack = require('webpack');

module.exports = {
  mode: 'production',
  bail: true,
  // devtool: 'nosources-source-map',
  // externals: { //工具包可不打包进bundle，由外部引入（html模板处引入，例如cdn）
  //   lodash: '_',
  //   dayjs: 'dayjs'
  // },
  module: {
    rules: [
      {
        test: /\.css$/i,
        use: [
          MiniCssExtractPlugin.loader,
          {
            loader: 'css-loader',
            options: {
              importLoaders: 1,
            },
          },
          {
            loader: 'postcss-loader',
            options: {
              // postcssOptions: {
              //   plugins: [
              //     'postcss-preset-env',  //简写
              //     require('postcss-preset-env') //包含autoprefixer插件
              //   ]
              // }
              // execute: true,
            },
          }],
        sideEffects: true
      },
      {
        test: /\.less$/i,
        use: [
          MiniCssExtractPlugin.loader,
          {
            loader: 'css-loader',
            options: {
              importLoaders: 1,
            },
          },
          {
            loader: 'postcss-loader',
            options: {
              // postcssOptions: {
              //   plugins: [
              //     'postcss-preset-env',  //简写
              //     require('postcss-preset-env') //包含autoprefixer插件
              //   ]
              // }
              // execute: true,
            },
          },
          {
            loader: 'less-loader',
            options: {
              lessOptions: {
                javascriptEnabled: true
              }
            }
          },
        ],
        sideEffects: true
      },
    ]
  },
  optimization: {
    usedExports: true,  //production模式下默认值为true,作用是使用魔法注释标注出那些变量或函数没有被使用。这些注释会交给Terser处理
    minimize: true,
    // minimizer: [
    // production 环境下默认开启terserPlugin
    // new TerserPlugin({ 
    //   extractComments: false,
    //   terserOptions: {
    //   }
    // })
    // ]
  },
  plugins: [
    new CleanWebpackPlugin(),
    new MiniCssExtractPlugin({
      filename: "css/[name].[contenthash:6].css"
    }),
    new CssMinimizerPlugin(),
    // new webpack.optimize.ModuleConcatenationPlugin(),  //生产模式默认启用
    // PurgeCssPlugin适用于懒加载,css的treeshaking
    new PurgeCssPlugin({
      paths: glob.sync(`${resolveApp("./src")}/**/*`, { nodir: true }),
      safelist: function () {
        return {
          standard: ["html", "body", "app"]
        }
      }
    }),
    new CompressionPlugin({
      test: /\.(css|js)$/i,
      minRatio: 0.8,
      algorithm: "gzip"
    })
  ],
  performance: {
    hints: "error"
  },
};
